<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
		<!--basic styles-->
		<link href="<?php echo base_url(); ?>assets/css/bootstrap.min.css" rel="stylesheet" />                       
		<link href="<?php echo base_url(); ?>assets/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css"/>
		<link href="<?php echo base_url(); ?>assets/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
        
		<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/jquery-ui-1.10.3.custom.min.css"/> 
		<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/chosen.css" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/datepicker.css" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/bootstrap-timepicker.css" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/daterangepicker.css" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/colorpicker.css" />        
        
		<!--ace styles-->
 
<body>
<?php $this->load->view('vheader')?>  
<br/>
<div class="widget-header widget-header-flat widget-header-bigger">
	<form  class="form-inline" />
        <label  for="form-field-select-3">Tampilkan Data Berdasarkan</label>
        &nbsp;
        <select id="form-field-select-1" data-placeholder="Pilih Kriteria">
            <option value="0" />Semua Data
            <option value="1" />Nama Supplier
            <option value="2" />No. Purchasing Order
            <option value="3" />Tanggal Purchasing Order
            <option value="4" />Status Purchasing Order
            <option value="5" />Tanggal Jatuh Tempo        
            </select>
        &nbsp;
        <select style="width:200px" class="chzn-select" id="form-field-select-3" data-placeholder="Pilih Data Hasil Pencarian">
            <option value="" />
            <option value="1" />Data 1
            <option value="2" />Data 2
            <option value="3" />Data 3 
            <option value="4" />Data 4
            <option value="5" />Data 5
        </select>
		&nbsp;        
        <button onclick="return false;" class="btn btn-info btn-small">
            <i class="icon-search bigger-110"></i>
            Tampilkan Data
        </button>			
	</form>
</div>  
<br/>
<!--Data Tabel-->
<!--Awal-->

    <table id="sample-table-2" class="table table-striped table-bordered table-hover" style="font-size:13px; height:auto">
        <thead>
            <tr>
                <th class="center" width="2%">
                    <label>
                        <input type="checkbox" />
                        <span class="lbl"></span>
                    </label>
                </th>
                <th class="center" class="" align="right" width="4%">No</th>
                <th class="center" class="center" width="12%">Tgl. Purchasing</th>
                <th class="center" width="10%">No PO</th>
                <th class="center hidden-480" width="10%">Total</th>
                <th class="center hidden-480" width="10%">Diskon</th>
                <th class="center hidden-480" width="10%">Netto</th>
                <th class="center hidden-480" width="10%">Ppn</th>
                <th class="center hidden-480" width="10%">Netto+Ppn</th>
                <th class="center hidden-480" width="10%">Tgl Jt Tempo</th>
				<th class="center hidden-480" width="10%">Status</th>
            </tr>
        </thead>
		</tbody>
<?php
if(!empty($nontender)){

$nmr = 1;
foreach($nontender as $row){
?>
            <tr>
              <td class="center" width="5%">
                 <label>
                     <input type="checkbox" />
                     <span class="lbl"></span>
                 </label>
              </td>
              <td class="center">
              <?php echo date("d-m-Y",strtotime($row->tanggal));?>
              </td>
              <td class="center">
              <?php echo $row->soid;?>
              </td>
              <td class="hidden-480" align="right">
              <?php echo number_format($row->total_1,0,'','.');?>&nbsp;
              </td>
              <td class="hidden-480" align="right">
              <?php echo number_format($row->potongan,0,'','.');?>&nbsp;
              </td>
              <td class="hidden-480" align="right">
              <?php echo number_format($row->total_2,0,'','.');?>&nbsp;
              </td>
              <td class="hidden-480" align="right">
              <?php echo number_format($row->ppn,0,'','.');?>&nbsp;
              </td>
              <td class="hidden-480" align="right">
              <?php echo number_format($row->total,0,'','.');?>&nbsp;
              </td>
              <td class="hidden-480" class="center">
                 <?php
                 if($row->status == '1'){
                     $status = "Dipesan";
                 }else if($row->status == '2'){
                     $status = "Dikirim";
                 }else if($row->status == '3'){
                     $status = "Terkirim";
                 }
                 ?>
                 <span class="label label-sm label-warning"><?php echo $status; ?></span>
              </td>

                <td class="center">
                    <div class="hidden-phone visible-desktop action-buttons">
                        <a class="blue" href="#">
                            <i class="icon-zoom-in bigger-130"></i>
                        </a>

                        <a class="green" href="#">
                            <i class="icon-trash bigger-130"></i>
                        </a>

                        <a class="red" href="#">
                            <i class="icon-shopping-cart bigger-130"></i>
                        </a>
                    </div>

                </td>
            </tr>            
<?Php 
$nmr++;
} 
} 
?>            
        </tbody>
    </table>
    <!--Akhir-->                  
<?php $this->load->view("vfooter") ?>

<script src="<?php echo base_url(); ?>assets/js/bootstrap.min.js"></script>
<!--basic scripts-->
<script src="<?php echo base_url(); ?>assets/js/chosen.jquery.min.js"></script>
<script src="<?php echo base_url(); ?>assets/js/jquery-ui-1.10.3.custom.min.js"></script>
<script src="<?php echo base_url(); ?>assets/js/jquery.ui.touch-punch.min.js"></script>

<!--page specific plugin scripts-->
<script src="<?php echo base_url(); ?>assets/js/jquery.dataTables.min.js"></script>
<script src="<?php echo base_url(); ?>assets/js/jquery.dataTables.bootstrap.js"></script>

<!--ace scripts-->


<!--End basic scripts-->

<!--inline scripts related to this page-->
<script type="text/javascript">
    $(function() {
				var oTable1 = $('#sample-table-2').dataTable( {
				"aoColumns": [
			      { "bSortable": false },
			      null, null,null, null, null,
				  { "bSortable": false }
				] } );
				
				
				$('table th input:checkbox').on('click' , function(){
					var that = this;
					$(this).closest('table').find('tr > td:first-child input:checkbox')
					.each(function(){
						this.checked = that.checked;
						$(this).closest('tr').toggleClass('selected');
					});
						
				});
			
			
				$('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});
				function tooltip_placement(context, source) {
					var $source = $(source);
					var $parent = $source.closest('table')
					var off1 = $parent.offset();
					var w1 = $parent.width();
			
					var off2 = $source.offset();
					var w2 = $source.width();
			
					if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
					return 'left';
				}
	
				$('#id-disable-check').on('click', function() {
					var inp = $('#form-input-readonly').get(0);
					if(inp.hasAttribute('disabled')) {
						inp.setAttribute('readonly' , 'true');
						inp.removeAttribute('disabled');
						inp.value="This text field is readonly!";
					}
					else {
						inp.setAttribute('disabled' , 'disabled');
						inp.removeAttribute('readonly');
						inp.value="This text field is disabled!";
					}
				});
			
			
				$(".chzn-select").chosen(); 
				
				$('[data-rel=tooltip]').tooltip({container:'body'});
				$('[data-rel=popover]').popover({container:'body'});
				
				$('textarea[class*=autosize]').autosize({append: "\n"});
				$('textarea[class*=limited]').each(function() {
					var limit = parseInt($(this).attr('data-maxlength')) || 100;
					$(this).inputlimiter({
						"limit": limit,
						remText: '%n character%s remaining...',
						limitText: 'max allowed : %n.'
					});
				});
				
				$.mask.definitions['~']='[+-]';
				$('.input-mask-date').mask('99/99/9999');
				$('.input-mask-phone').mask('(999) 999-9999');
				$('.input-mask-eyescript').mask('~9.99 ~9.99 999');
				$(".input-mask-product").mask("a*-999-a999",{placeholder:" ",completed:function(){alert("You typed the following: "+this.val());}});
											
				
				$('#id-input-file-1 , #id-input-file-2').ace_file_input({
					no_file:'No File ...',
					btn_choose:'Choose',
					btn_change:'Change',
					droppable:false,
					onchange:null,
					thumbnail:false //| true | large
					//whitelist:'gif|png|jpg|jpeg'
					//blacklist:'exe|php'
					//onchange:''
					//
				});
				
				$('#id-input-file-3').ace_file_input({
					style:'well',
					btn_choose:'Drop files here or click to choose',
					btn_change:null,
					no_icon:'icon-cloud-upload',
					droppable:true,
					thumbnail:'small'
					//,icon_remove:null//set null, to hide remove/reset button
					/**,before_change:function(files, dropped) {
						//Check an example below
						//or examples/file-upload.html
						return true;
					}*/
					/**,before_remove : function() {
						return true;
					}*/
					,
					preview_error : function(filename, error_code) {
						//name of the file that failed
						//error_code values
						//1 = 'FILE_LOAD_FAILED',
						//2 = 'IMAGE_LOAD_FAILED',
						//3 = 'THUMBNAIL_FAILED'
						//alert(error_code);
					}
			
				}).on('change', function(){
					//console.log($(this).data('ace_input_files'));
					//console.log($(this).data('ace_input_method'));
				});
				
			
				//dynamically change allowed formats by changing before_change callback function
				$('#id-file-format').removeAttr('checked').on('change', function() {
					var before_change
					var btn_choose
					var no_icon
					if(this.checked) {
						btn_choose = "Drop images here or click to choose";
						no_icon = "icon-picture";
						before_change = function(files, dropped) {
							var allowed_files = [];
							for(var i = 0 ; i < files.length; i++) {
								var file = files[i];
								if(typeof file === "string") {
									//IE8 and browsers that don't support File Object
									if(! (/\.(jpe?g|png|gif|bmp)$/i).test(file) ) return false;
								}
								else {
									var type = $.trim(file.type);
									if( ( type.length > 0 && ! (/^image\/(jpe?g|png|gif|bmp)$/i).test(type) )
											|| ( type.length == 0 && ! (/\.(jpe?g|png|gif|bmp)$/i).test(file.name) )//for android's default browser which gives an empty string for file.type
										) continue;//not an image so don't keep this file
								}
								
								allowed_files.push(file);
							}
							if(allowed_files.length == 0) return false;
			
							return allowed_files;
						}
					}
					else {
						btn_choose = "Drop files here or click to choose";
						no_icon = "icon-cloud-upload";
						before_change = function(files, dropped) {
							return files;
						}
					}
					var file_input = $('#id-input-file-3');
					file_input.ace_file_input('update_settings', {'before_change':before_change, 'btn_choose': btn_choose, 'no_icon':no_icon})
					file_input.ace_file_input('reset_input');
				});
			
			
			
			
				$('#spinner1').ace_spinner({value:0,min:0,max:200,step:10, btn_up_class:'btn-info' , btn_down_class:'btn-info'})
				.on('change', function(){
					//alert(this.value)
				});
				$('#spinner2').ace_spinner({value:0,min:0,max:10000,step:100, icon_up:'icon-caret-up', icon_down:'icon-caret-down'});
				$('#spinner3').ace_spinner({value:0,min:-100,max:100,step:10, icon_up:'icon-plus', icon_down:'icon-minus', btn_up_class:'btn-success' , btn_down_class:'btn-danger'});
			
			
				
				$('.date-picker').datepicker().next().on(ace.click_event, function(){
					$(this).prev().focus();
				});
				$('#id-date-range-picker-1').daterangepicker().prev().on(ace.click_event, function(){
					$(this).next().focus();
				});
				
				$('#timepicker1').timepicker({
					minuteStep: 1,
					showSeconds: true,
					showMeridian: false
				})
				
				$('#colorpicker1').colorpicker();
				$('#simple-colorpicker-1').ace_colorpicker();
			
				
				$(".knob").knob();
				
				
				//we could just set the data-provide="tag" of the element inside HTML, but IE8 fails!
				var tag_input = $('#form-field-tags');
				if(! ( /msie\s*(8|7|6)/.test(navigator.userAgent.toLowerCase())) ) 
					tag_input.tag({placeholder:tag_input.attr('placeholder')});
				else {
					//display a textarea for old IE, because it doesn't support this plugin or another one I tried!
					tag_input.after('<textarea id="'+tag_input.attr('id')+'" name="'+tag_input.attr('name')+'" rows="3">'+tag_input.val()+'</textarea>').remove();
					//$('#form-field-tags').autosize({append: "\n"});
				}
			
			
				/////////
				$('#modal-form input[type=file]').ace_file_input({
					style:'well',
					btn_choose:'Drop files here or click to choose',
					btn_change:null,
					no_icon:'icon-cloud-upload',
					droppable:true,
					thumbnail:'large'
				})
				
				//chosen plugin inside a modal will have a zero width because the select element is originally hidden
				//and its width cannot be determined.
				//so we set the width after modal is show
				$('#modal-form').on('show', function () {
					$(this).find('.chzn-container').each(function(){
						$(this).find('a:first-child').css('width' , '200px');
						$(this).find('.chzn-drop').css('width' , '210px');
						$(this).find('.chzn-search input').css('width' , '200px');
					});
				})

										
			});
		</script>			
<!--End inline scripts related to this page-->		
</body>
</html>